<template>
  <div class="table-toolbar" ref="target">
    <a-space>
      <publish-user />
    </a-space>
    <a-space>
      <refresh />
      <lineheight style="margin: 0 6px" />
      <column />
    </a-space>
    <teleport to="#rights-management-toolbar-right" defer>
      <div style="display: flex; align-items: center" v-if="targetIsVisible">
        <search />
      </div>
    </teleport>
  </div>
</template>
<script setup>
import PublishUser from './table-toolbar-publish.vue'
import refresh from './table-toolbar-refresh.vue'
import lineheight from './table-toolbar-lineheight.vue'
import column from './table-toolbar-column.vue'
import search from './search.vue'
import { useElementVisibility } from '@vueuse/core'
import { useTemplateRef } from 'vue'
let target = useTemplateRef('target')
let targetIsVisible = useElementVisibility(target)
</script>
<style lang="less" scoped>
.table-toolbar {
  display: flex;
  justify-content: space-between;
  margin-bottom: 16px;
}
</style>
